<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>医生管理</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<link rel="stylesheet" href="./css/x-admin.css" media="all">
<link rel="stylesheet" href="css/pag.css" media="all">
<link rel="stylesheet" href="../assets/layui/css/layui.css">
<script src="../back/lib/bootstrap/js/bootstrap.min.js"></script>
<script src="../assets/layer/layer.js"></script>
<script src="../back/lib/layui/layui.js"></script>
<link href="../back/lib/bootstrap/css/bootstrap.min.css"
	rel="stylesheet">
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath }/back/static/h-ui/css/H-ui.min.css" />
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath }/back/static/h-ui.admin/css/H-ui.admin.css" />
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath }/back/lib/Hui-iconfont/1.0.8/iconfont.css" />
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath }/back/static/h-ui.admin/skin/default/skin.css"
	id="skin" />
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath }/back/static/h-ui.admin/css/style.css" />
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath }/back/lib/layui/css/layui.css" />
</head>
<body>
	<div class="x-nav">
		<span class="layui-breadcrumb"> <a><cite>首页</cite></a> <a><cite>医生管理</cite></a>
		</span> <a class="layui-btn layui-btn-small"
			style="line-height: 1.6em; margin-top: 3px; float: right"
			href="javascript:location.replace(location.href);" title="刷新"><i
			class="layui-icon" style="line-height: 30px">ဂ</i></a>
	</div>
	<div class="x-body">
		<form class="layui-form x-center" action="" style="width: 85%">
			<div class="layui-form-pane">
				<div class="layui-form-item">
					<div class="layui-input-inline" style="width: 200px">
						<input type="text" name="link" placeholder="搜索" autocomplete="off"
							class="layui-input">
					</div>
					<div class="layui-input-inline" style="width: 80px">
						<button class="layui-btn" lay-submit="" lay-filter="*">搜索</button>
					</div>
				</div>
			</div>
		</form>

		<div class="tools">
			<ul class="toolbar">
				<li onclick="change()" data-toggle="modal"><span><img
						src="images/t01.png" /></span>添加</li>
			</ul>
			<span class="x-right" style="line-height: 25px">拥有医生：<span
				id="count"></span>人
			</span>
		</div>
		<table class="tablelist">
			<thead>
				<tr>
					<th><input onclick="selectAll()" type="checkbox"
						name="controlAll" style="" id="controlAll"></th>
					<th>编号</th>
					<th>姓名</th>
					<th>性别</th>
					<th>门诊部门</th>
					<th>工作年龄</th>

					<th>操作</th>
				</tr>
			</thead>
			<tbody>
				<c:forEach items="${doctorlistback}" var="doctorlistback">
					<tr>
						<td><input type="checkbox" value="1" name="selected"></td>
						<td>${doctorlistback.doctorid}</td>
						<td>${doctorlistback.doctorname}</td>
						<td>${doctorlistback.doctorsex}</td>
						<td>${doctorlistback.outPatientServiceTypeName}</td>
						<td>${doctorlistback.jobtime}</td>
						<td class="td-manage"><a title="编辑" href="javascript:;"
							onclick="changeUpd(this)" class="ml-5"
							style="text-decoration: none"> <i class="layui-icon">&#xe642;</i>
						</a> <a title="删除" href="javascript:;" class="delDoctor"
							style="text-decoration: none"> <i class="layui-icon">&#xe640;</i>
						</a></td>
					</tr>
				</c:forEach>
			</tbody>
		</table>
		<!-- 这里放我们的修改遮罩层 -->
		<div class="row clearfix">
			<div class="col-md-12 column">
				<div class="modal fade" id="modal-container-upd" role="dialog"
					aria-labelledby="myModalLabel" aria-hidden="true">
					<!-- 通过样式设置层的宽度 -->
					<div class="modal-dialog" style="width: 900px">
						<div class="modal-content">

							<div class="modal-header">
								<button type="button" class="close" data-dismiss="modal"
									aria-hidden="true">×</button>
								<h4 class="modal-title" id="myModalLabel">修改医生信息</h4>
							</div>
							<!-- 表单开始  action ="url" 一个动态可以接受当前表单数据的地址  xx.php /xx.jsp /xx.action xx.do 某个servlet文件... -->
							<form class="form-horizontal" role="form">
								<div class="modal-body">
									<div class="form-group">
										<label for="doctorid" class="col-sm-2 control-label">医生编号</label>
										<div class="col-sm-8">
											<input type="text" required="required" class="form-control"
												name="doctorid" id="doctorid" readonly="readonly" />
										</div>
									</div>

									<div class="form-group">
										<label for="doctornameUpd" class="col-sm-2 control-label">医生姓名</label>
										<div class="col-sm-8">
											<input type="text" required="required" class="form-control"
												name="doctornameUpd" id="doctornameUpd" readonly="readonly" />
										</div>
									</div>

									<div class="form-group">
										<label for="doctorsexUpd1" class="col-sm-2 control-label">医生性别</label>
										<div class="col-sm-8">
											<input type="text" required="required" class="form-control"
												name="doctorSexUpd1" id="doctorSexUpd1" readonly="readonly" />
											<!-- 	<select id="doctorsex" name="doctorsex" >
												<option value="男" >男</option>
												<option value="女">女</option>
											</select> -->
										</div>
									</div>

									<div class="form-group">
										<label for="outpatientservicetypeid"
											class="col-sm-2 control-label">科室编号</label>
										<div class="col-sm-8">
											<!-- <input type="text" required="required" class="form-control"
												name="keshiId" id="keshiId" /> -->
											<select id="outpatientservicetypeidUpd"
												name="outpatientservicetypeidUpd">
												<option value="1">1</option>
												<option value="2">2</option>
												<option value="3">3</option>
												<option value="4">4</option>
												<option value="5">5</option>
												<option value="6">6</option>
												<option value="7">7</option>
												<option value="8">8</option>
												<option value="9">9</option>
												<option value="10">10</option>
											</select>
										</div>
									</div>

									<div class="form-group">
										<label for="jobtimeUpd" class="col-sm-2 control-label">工作年龄</label>
										<div class="col-sm-8">
											<input type="text" required="required" class="form-control"
												name="jobtimeUpd" id="jobtimeUpd" />
										</div>
									</div>
								</div>
								<div class="modal-footer">
									<button type="button" class="btn btn-default"
										data-dismiss="modal">关闭</button>
									<button type="submit" class="btn btn-primary" id="upd">修改</button>
								</div>
							</form>
							<!-- 表单结束 -->
						</div>
					</div>
				</div>
			</div>
		</div>
		<!-- 修改遮罩层的结束 -->
		<!-- 这里放我们的添加遮罩层 -->
		<div class="row clearfix">
			<div class="col-md-12 column">
				<div class="modal fade" id="modal-container-534629" role="dialog"
					aria-labelledby="myModalLabel" aria-hidden="true">
					<!-- 通过样式设置层的宽度 -->
					<div class="modal-dialog" style="width: 500px">
						<!-- 隐藏域 -->
						<input type="hidden" value="${busiInfo.licence }" id="scenery-value" name="doctorImg" />
						<div class="modal-content">
							<div class="modal-header">
								<button type="button" class="close" data-dismiss="modal"
									aria-hidden="true">×</button>
								<h4 class="modal-title" id="myModalLabel">添加医生</h4>
							</div>
							<!-- 表单开始  action ="url" 一个动态可以接受当前表单数据的地址  xx.php /xx.jsp /xx.action xx.do 某个servlet文件... -->
							<form class="form-horizontal" role="form">
							<div style="margin-left: 50px">
										<label for="doctorname">医生姓名</label>
											<input type="text" required="required" class="form-control"
												name="doctorname" id="doctorname" placeholder="请输入医生姓名" style="width: 250px"/>


										<label for="doctorname">医生图片</label><br>
												<button type="button" class="layui-btn" id="test2">上传医生图片</button><br>
													<img style="width: 150px; height: 98px"
														class="layui-upload-img" id="demo2">
													<p id="demoText"></p>

										<label for="doctorsex">医生性别</label>
											<!-- <input type="text" required="required" class="form-control"
												name="doctorSex" id="doctorSex" /> -->
											<select id="doctorsex" name="doctorsex" class="form-control" style="width: 250px">
												<option value="男">男</option>
												<option value="女">女</option>
											</select>

										<label for="outpatientservicetypeid">科室编号</label>
											<!-- <input type="text" required="required" class="form-control"
												name="keshiId" id="keshiId" /> -->
											<select id="outpatientservicetypeid"
												name="outpatientservicetypeid" class="form-control" style="width: 250px">
												<option value="1">1</option>
												<option value="2">2</option>
												<option value="3">3</option>
												<option value="4">4</option>
												<option value="5">5</option>
												<option value="6">6</option>
												<option value="7">7</option>
												<option value="8">8</option>
												<option value="9">9</option>
												<option value="10">10</option>
											</select>

										<label for="jobtime">工作年龄</label>
											<input type="text" required="required" class="form-control"
												name="jobtime" id="jobtime" style="width: 250px"/>
												</div>
								<div class="modal-footer">
									<button type="button" class="btn btn-default"
										data-dismiss="modal">关闭</button>
									<button type="submit" class="btn btn-primary" id="add">添加</button>
								</div>
							</form>
							<!-- 表单结束 -->
						</div>
					</div>
				</div>
			</div>
		</div>
		<!-- 添加遮罩层的结束 -->
		<script type="text/javascript">
			
		</script>
		
		<div class="page" v-show="show">
			<div class="pagelist">
				<span class="jump">上一页</span> <span class="jump">1</span> <span
					class="jump">2</span> <span class="jump">3</span> <span
					class="jump">4</span> <span class="jump">5</span> <span
					class="jump">6</span> <span class="ellipsis">...</span> <span
					class="jump">下一页</span> <span class="jumppoint">跳转到：</span> <span
					class="jumpinp"> <input type="text">
				</span> <span class="jump gobtn">GO</span>
			</div>
		</div>
	</div>
	<br />
	<br />
	<br />
	<script src="./lib/layui/layui.js" charset="utf-8"></script>
	<script type="text/javascript"
		src="${pageContext.request.contextPath}/back/lib/jquery/1.9.1/jquery.min.js"></script>
	<script type="text/javascript"
		src="${pageContext.request.contextPath}/back/static/h-ui/js/H-ui.min.js"></script>
	<script
		src="${pageContext.request.contextPath}/assets/layui/layui.all.js"></script>
	<!-- 上传图片      注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
	<script>
		layui
				.use(
						'upload',
						function() {
							var $ = layui.jquery, upload = layui.upload;

							//景点图片上传
							var uploadInst = upload
									.render({
										elem : '#test2',
										url : '${pageContext.request.contextPath }/UploadHandleServlet',
										before : function(obj) {
											//预读本地文件示例，不支持ie8
											obj
													.preview(function(index,
															file, result) {
														$('#demo2').attr('src',
																result); //图片链接（base64）
													});
										},
										done : function(res) {
											//如果上传失败
											if (res.code < 1) {
												return layer.msg('上传失败');
											} else {
												layer.msg('上传成功');
												var sceneryPath = eval(res).data.path;
												$("#scenery-value").attr(
														"value", sceneryPath);//返回的图片路径
											}
											//上传成功
										},
										error : function() {
											//演示失败状态，并实现重传
											var demoText = $('#demoText');
											demoText
													.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
											demoText.find('.demo-reload').on(
													'click', function() {
														uploadInst.upload();
													});
										}
									});

						});
	</script>




	<script type="text/javascript">
		$('.tablelist tbody tr:odd').addClass('odd');
	</script>
	<!-- ajax请求操作 -->
	<script type="text/javascript">
		$(function() {
			$.ajax({
				url : '${pageContext.request.contextPath}/doctorListBack',
				type : 'GET',
				success : function(result) {
					if (result != null) {
					}
				}
			});

			$.ajax({
				url : '${pageContext.request.contextPath}/doctorCount',
				type : 'GET',
				success : function(result) {
					if (result != null) {
						$("#count").text(result);
					}
				}
			});
		});
		//添加的模态
		function change() {
			$("#modal-container-534629").modal("show");
			/* $("#doctorname").val(doctorname);
			$("#doctorsex").val(doctorsex);
			$("#outpatientservicetypeid").val(outpatientservicetypeid);
			$("#jobtime").val(jobtime); */
			$("#add")
					.click(
							function() {
								$
										.ajax({
											url : "${pageContext.request.contextPath}/doctorAdd"
													+ $("#doctorid").val(),
											type : "post", //增加操作  post方法
											contentType : "application/json",
											data : JSON
													.stringify({
														doctorname : $(
																"#doctorname")
																.val(),
														doctorsex : $(
																"#doctorsex")
																.val(),
														outpatientservicetypeid : $(
																"#outpatientservicetypeid")
																.val(),
														jobtime : $("#jobtime")
																.val(),
														doctorImg : $(
																"#scenery-value")
																.val(),
													}),
											success : function(result) {
												if (result == 1) {
													location.href = "${pageContext.request.contextPath}/doctorListBack"
												}
											}
										});

							});
		}
		//修改的模态
		function changeUpd(e) {
			$("#modal-container-upd").modal("show");
			var doctorid = $(e).parents("tr").find("td").eq(1).text();
			var doctornameUpd = $(e).parents("tr").find("td").eq(2).text();
			var doctorsexUpd = $(e).parents("tr").find("td").eq(3).text();
			var outpatientservicetypeidUpd = $(e).parents("tr").find("td")
					.eq(4).text();
			var jobtimeUpd = $(e).parents("tr").find("td").eq(5).text();

			$("#doctorid").val(doctorid);
			$("#doctornameUpd").val(doctornameUpd);
			$("#doctorSexUpd1").val(doctorsexUpd);
			$("#outpatientservicetypeidUpd").val(outpatientservicetypeidUpd);
			$("#jobtimeUpd").val(jobtimeUpd);
			$("#upd")
					.click(
							function() {
								$
										.ajax({
											url : "${pageContext.request.contextPath}/doctorUpd/"
													+ $("#doctorid").val(),
											type : "put", //修改操作  put方法
											contentType : "application/json",
											data : JSON
													.stringify({
														"doctorid" : $(
																"#doctorid")
																.val(),
														"doctorname" : $(
																"#doctornameUpd")
																.val(),
														"doctorsex" : $(
																"#doctorSexUpd1")
																.val(),
														"outpatientservicetypeid" : $(
																"#outpatientservicetypeidUpd")
																.val(),
														"jobtime" : $(
																"#jobtimeUpd")
																.val(),
													}),
											success : function(result) {
												if (result == 1) {
													window.location.reload();
												}
											}
										});

							});
		}
		//删除医生
		$(function() {
			//ajax删除

			$(".delDoctor")
					.click(
							function() {
								var id = $(this).parents("tr").find("td").eq(1)
										.text();
								layer
										.open({
											content : '确定删除该医生？',
											btn : [ '确定', '取消' ],
											yes : function() {
												//按钮【按钮一】的回调
												$
														.ajax({
															url : '${pageContext.request.contextPath}/doctorDel/'
																	+ id,
															type : 'delete',
															success : function(
																	result) {
																if (result == 1) {
																	location.href = "${pageContext.request.contextPath}/doctorListBack"
																}
															}
														});
												return false;
											},
											btn2 : function(index, layero) {
												//按钮【按钮二】的回调
												location.reload();
												//return false; 开启该代码可禁止点击该按钮关闭
											},
											cancel : function() {
												//右上角关闭回调

												//return false 开启该代码可禁止点击该按钮关闭
											}
										});

							});
		});
	</script>
</body>
</html>